<script type="text/javascript" language="javascript" src="<?php echo base_url(); ?>public/js/jquery.validate.js"></script>
<script src="<?php echo base_url(); ?>public/js/chosen.jquery.min.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>public/js/ajax-chosen.min.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>public/js/validation-custom-text.js" type="text/javascript"></script>
<script type="text/javascript">
    var isAddOffer = true, offerid = 0;
    $(document).ready(function(){
        clearMedalDetail();
        changeOfferForm();
        
        $("#sofficial-order").change(function(){            
            oTable.fnReloadAjax("<?php echo base_url(); ?>index.php/medal_offer/offer_list?"  + $("#search-offer-form").serialize()); 
        }).ajaxChosen({
            method: 'GET',
            url: '<?php echo base_url(); ?>index.php/official_order/official_list',
            dataType: 'json'
        }, function (data) {
            var terms = {};			
            $.each(data, function (i, val) {
                terms[val.ID] = val.Order_Number;
            });			
            return terms;
        }); 
        
        $("#official-order").change(function(){
            //  $("#smedaltype").change();
            // Do something
        }).ajaxChosen({
            method: 'GET',
            url: '<?php echo base_url(); ?>index.php/official_order/official_list',
            dataType: 'json'
        }, function (data) {
            var terms = {};			
            $.each(data, function (i, val) {
                terms[val.ID] = val.Order_Number;
            });			
            return terms;
        }); 
        
        $("#smedaltype").change(function(){            
            $("#offer-medal .filter").hide();
            $("#offer-medal .filter td input").val(0);
            var id = $("#smedaltype").val();
            if(id < 6){                       
                $("#offer-medal .first-level").show();
            }else if(id < 11){
                $("#offer-medal .second-level").show();                
            }else if(id < 14){
                $("#offer-medal .third-level").show();                             
            }
            
            var url = "<?php echo base_url(); ?>index.php/medal_offer/stock_summary";
            var data = "ID=" + id + "&official_id=" + $("#official-order").val();
            $.post(url, data, function(callback){           
                
                $.each(callback.stock, function(key, val) {
                    $("#offer-medal .filter td input[c='"+ val.Medal_Class_ID +"']").each(function(){
                        if($(this).hasClass("stock")){
                            $("#offer-medal .type").html(val.name); 
                            $(this).val(Number(val.amount));
                        }
                    });
                });
                
                $.each(callback.summary, function(key, val) {
                    $("#offer-medal .filter td input[c='"+ val.Medal_Class_ID +"']").each(function(){
                        if($(this).hasClass("summary")){
                            $("#offer-medal .type").html(val.name); 
                            $(this).val(Number(val.amount));
                        }
                    });
                });
                
            }, "json");
        }).chosen();
        
        $("#sfrom").datepicker({
            onSelect: function(selected) {
                $( "#sto" ).datepicker("option", "minDate", selected);    
                oTable.fnReloadAjax("<?php echo base_url(); ?>index.php/medal_offer/offer_list?"  + $("#search-offer-form").serialize()); 
            }
        });
        $("#sto").datepicker({
            onSelect: function(selected) {
                $("#sfrom").datepicker("option", "maxDate", selected);
                oTable.fnReloadAjax("<?php echo base_url(); ?>index.php/medal_offer/offer_list?"  + $("#search-offer-form").serialize()); 
            }
        });
        
        $(".edit-offer").live("click", function(event){
            event.preventDefault();
            offerid = $(this).attr("rel");
            readOffer();
        });
        
        $('#show-more').click(function (e){
            e.preventDefault();
            $('#search-detail').slideToggle("slow");
        });
        
        //add event handler for edit form officeial order form
        $(".delete-offer").live('click', function(event){
            event.preventDefault();
            var id = $(this).attr("rel");
            if(confirm("តើពិតជាចង់លុបមែនរឺ?")){
                var url = "<?php echo base_url(); ?>index.php/medal_offer/deleteOffer";
                var data = "ID=" + id;
                $.post(url, data, function(callback){     
                    if (!callback.result){
                        $('#medal-offer .err-msg').html(callback.message);
                    }else{   
                        $('#medal-offer .err-msg').html(callback.message);         
                        oTable.fnDraw(false);
                    }
                }, "json");
            }
        });
        
        // cancel official order
        $("#offer-cancel").click(function(event) {
            event.preventDefault();
            clearOffer();
            changeOfferForm();
        });        
        
        $("#offer-medal input").autoNumeric({
            aNum: "0123456789",
            aSep: "",
            dGroup: "3",
            aDec: ".",
            altDec: null,
            aSign: "",
            pSign: "p",
            vMax: "999999999999999999999999999999",
            vMin: "0",
            mDec: null,
            mRound: "S",
            aPad: false,
            aForm: false
        });
        
        var oTable = $('#officer-table').dataTable( {
            "bSortClasses": false,
            "bPaginate": true,
            "bLengthChange": true,
            "bFilter": false,
            "bSort": true,
            "bInfo": false,
            "bAutoWidth": false,
            "aoColumns" : [
                { sWidth: '30px' },
                { sWidth: '100px' },
                { sWidth: '200px' },
                { sWidth: '100px' },
                { sWidth: '20px' }
            ] ,
            "aoColumnDefs": [ 
                { "bSortable": false, "aTargets": [ 0,4] }
            ],
            "aaSorting": [[ 2, "desc" ]],
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": "<?php echo base_url(); ?>index.php/medal_offer/offer_list?"  + $("#search-offer-form").serialize(),
            "fnDrawCallback": function() {
                clearOffer();               
                changeOfferForm();
            }
        });
        
        $("#frm-offer").ajaxForm({
            beforeSerialize: function(){     
                if(offerid != 0){
                    $("#offerid").val(offerid);
                }else{
                    $("#offerid").removeAttr("value");
                }
                $("#medal-data").html("");
                $("#offer-medal  input").each(function(){
                    if($(this).val()>0){
                        $("#medal-data").append("<input type='hidden' name='"+$(this).attr("name")+"' value='"+$(this).val()+"' />");
                    }                        
                });
            },
            beforeSubmit: function(){
                validateDefaultText('#frm-offer input');
                var validate = $('#frm-offer').validate().form();
                if (validate == false){
                    returnDefaultText('#frm-offer input');
                    validate.error();
                    return validate; 
                }
                // waiting
                $('#medal-offer .loading').show();
                $('#medal-offer .add-button').addClass('disable-add-button');
                $('#medal-offer .update-button').addClass('disable-update-button');
                $('#medal-offer .add-button, #medal-offer .update-button').attr('disabled', 'disabled');
            },
            url:  '<?php echo base_url(); ?>index.php/medal_offer/offer',
            dataType: 'json',
            error: function(){
                // stop waiting display error
                $('#medal-offer .err-msg').html("ទិន្នន័យមិនអាចរក្សាទុកបានដោយបញ្ហាបច្ចេកទេស");                
                $('#medal-offer .loading').hide();
                $('#medal-offer .add-button').removeClass('disable-add-button');
                $('#medal-offer .update-button').removeClass('disable-update-button');
                $('#medal-offer .add-button, #medal-offer .update-button').removeAttr('disabled');
            },
            success: function (data){                
                if (!data.result){
                    $('#medal-offer .err-msg').html(data.message);
                }else{            
                    $('#medal-offer .err-msg').html(data.message);
                    oTable.fnDraw(false);
                }
                $('#medal-offer .loading').hide();
                $('#medal-offer .add-button').removeClass('disable-add-button');
                $('#medal-offer .update-button').removeClass('disable-update-button');
                $('#medal-offer .add-button, #medal-offer .update-button').removeAttr('disabled');
            }
        });
        
        
        
        // add select available for officer datatable
        $("#officer-table tbody").click(function(event) {
            $(oTable.fnSettings().aoData).each(function (){
                $(this.nTr).removeClass('row_selected');
            });
            $(event.target.parentNode).addClass('row_selected');
            var id= $(event.target.parentNode).find(".edit-offer").attr("rel");            
            $.ajax({
                url: "<?php echo base_url(); ?>index.php/medal_offer/read_medal",
                data : "id="+id,
                type: "POST",
                dataType: "json",
                success: function(result){                      
                    $.each(result, function(key, val) {
                        $("#offer-medal td input[c='"+ val.Medal_Class_ID +"'][t='"+val.Medal_Type_ID+"']").val(Number(val.amount)).attr("disabled", "disabled");
                    });
                }
            });
            $.ajax({
                url: "<?php echo base_url(); ?>index.php/medal_offer/read_offer",
                data : "id="+id,
                type: "POST",
                dataType: "json",
                success: function(result){                              
                    $(".offer-medal-note b").html(result.note);
                    $(".offer-medal-note").show();
                }
            });
        });
    });    
    
    // when change from add -> update or update -> add
    function changeOfferForm(){
        if(isAddOffer){
            $("#offer-update, #offer-cancel").hide();
            $("#offer-submit").show();
        }else{
            $("#offer-update, #offer-cancel").show();
            $("#offer-submit").hide();            
        }
    }
    
    function clearOffer(){        
        isAddOffer = true;
        offerid = 0;
        clearMedalDetail();
        $(".offer-medal-note").hide();
        $('#offer-medal .filter').hide();
        $("#form-add-offer #date").val("កាលបរិច្ឆេទ​");
        $("#form-add-offer #consignee").val("អ្នកយក");
        $("#form-add-offer #official_note").val("សំគាល់​");
        $("#form-add-offer .err-msg").html(""); 
        $("#form-add-offer select").val("").trigger("liszt:updated");         
        $('#form-add-offer .populated-text').each(function () {
            populateText($(this));
        }); 
    }
    
    function readOffer(){
        $.ajax({
            url: "<?php echo base_url(); ?>index.php/medal_offer/read_offer",
            data : "id="+offerid,
            type: "POST",
            dataType: "json",
            success: function(result){
                isAddOffer = false;
                changeOfferForm();
                $("#form-add-offer #official-order").val(result.official_order_id).trigger("liszt:updated");         
                $("#form-add-offer #date").datepicker("setDate", new Date(result.date));
                $("#form-add-offer #consignee").val(result.consignee_name);
                $("#form-add-offer #official_note").val(result.note);
                setDataEntered($("#form-add-offer")); 
            }
        });
        $.ajax({
            url: "<?php echo base_url(); ?>index.php/medal_offer/read_medal",
            data : "id="+offerid,
            type: "POST",
            dataType: "json",
            success: function(result){                      
                $.each(result, function(key, val) {
                    $("#offer-medal td input[c='"+ val.Medal_Class_ID +"'][t='"+val.Medal_Type_ID+"']").val(Number(val.amount)).attr("disabled", "disabled");
                });
            }
        });
    }
    
    function clearMedalDetail(){
        $('#offer-medal input').not(".summary").not(".stock").each(function () {
            $(this).val(0);
            $(this).removeAttr("disabled");
            populateText($(this));
        }); 
    }
</script>
<div id="left-content">
    <div id="medal-offer" class="content-block">
        <div class="block-header">សៀវភៅមេដាយ</div>
        <div id="block-content">
            <div id="search-panel">
                <form method="post" name="search-offer-form" autocomplete="off" id="search-offer-form" enctype="multipart/form-data">
                    <fieldset>
                        <select id="sofficial-order" name="sofficial-order" class="required"/>
                        <option value="" >ព្រះរាជាក្រឹត្យ</option>
                        <?php foreach ($officialOrders as $officialOrder) { ?>
                            <option value="<?= $officialOrder['ID'] ?>" ><?= $officialOrder['Order_Number'] ?></option>
                        <?php } ?>
                        </select>
                        <input type="text" name="sfrom" id="sfrom" value="ចាប់ពីថ្ងៃទី" class="text input datepicker required populated-text" />     
                        <input type="text" name="sto" id="sto" value="ទៅដល់" class="text input datepicker required populated-text" />
                        <span id="show-more"><a href="#">បញ្ជាក់បន្ថែម</a></span>
                        <div class="break"></div>
                        <div id="search-detail">
                            <select id="smedaltype" name="smedaltype" class="required left"/>
                            <option value="" >ប្រភេទមេដាយ​</option>                  
                            <?php
                            foreach ($medaltypes as $medaltype):
                                echo "<option value='{$medaltype['ID']}'>{$medaltype['name']}</option>";
                            endforeach;
                            ?>
                            </select>
                        </div>     
                        <div class="break"></div>
                    </fieldset>
                </form>
            </div>
            <table id="officer-table" class="no-vertical-border bedatable">
                <thead>
                    <tr>
                        <th class="index-col">ល.រ</th>
                        <th >ព្រះរាជាក្រឹត្យ​</th>
                        <th >អ្នកយក</th>
                        <th >ការបរិច្ឆេទ</th>
                        <th align="center" class="blank-header" ></th>
                        <th align="center" class="blank-header" ></th>
                    </tr>
                </thead>
            </table>
            <div class="break"></div>
            <div id="form-add-offer" class="form-add-panel">
                <div id="title">បញ្ជូលអ្នកមកយកមេដាយថ្មី៖</div>
                <div class="err-msg"></div>
                <div class="loading"><img src="<?php echo base_url(); ?>public/images/forms/loading-bar.gif" /></div>
                <form method="post" action="#" autocomplete="off" name='frm-offer' id="frm-offer" >
                    <select id="official-order" name="official-order" class="required"/>
                    <option value="" >ព្រះរាជាក្រឹត្យ</option>
                    <?php foreach ($officialOrders as $officialOrder) { ?>
                        <option value="<?= $officialOrder['ID'] ?>" ><?= $officialOrder['Order_Number'] ?></option>
                    <?php } ?>
                    </select>
                    <div id="medal-data"></div>
                    <input type="text" name="date" id="date" value="ការបរិច្ឆេទ" class="text input datepicker dateDefault required populated-text" />    
                    <input type="text" name="consignee" id="consignee" value="អ្នកយក" class="text input required populated-text" />                    
                    <input type="text" name="note" id="official_note" value="សំគាល់" class="text input required populated-text" />
                    <input type="hidden" name="offerid" id="offerid" />
                    <input type="submit" id="offer-cancel" name="offer-cancel" value="" class="cancel-button right" />
                    <input type="submit" id="offer-update" name="offer-update" value="" class="update-button right" />
                    <input type="submit" id="offer-submit" name="offer-submit" value="" class="add-button" />
                    <div class="break"></div>
                </form>
            </div>
        </div>
    </div>
    <!-- medal receipt-->
    <!--<form method="post" action="#" name='frmAdd' >-->
    <div id="offer-medal" class="content-block">
        <div class="block-header">ចំនួនមេដាយ</div>
        <div id="block-content">       
            <div class="offer-medal-note">
                សំគាល់ៈ <b></b>
            </div>
            <div>
                <table id="data-table" class="no-vertical-border medal-detail first-level filter">
                    <tr>
                        <th scope="col" class="type">ប្រភេទ</th>
                        <th scope="col">មហាសិរីវឌ្ឍន៌</th>
                        <th scope="col">មហាសេនា</th>
                        <th scope="col">ធិបឌិន្ទុ</th>
                        <th scope="col">សេនា</th>
                        <th scope="col">អស្សរិទ្ធិ</th>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនមេដាយសរុប៖</th>
                        <td><input type="text" name="summary[1]" class="summary" c="1" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[2]" class="summary"  c="2" readonly="readonly"  value="0"  /></td>
                        <td><input type="text" name="summary[3]" class="summary"  c="3" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[4]" class="summary"  c="4" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[5]" class="summary"  c="5" readonly="readonly" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនក្នុងស្តុក៖</th>
                        <td><input type="text" name="summary[1]" class="stock"  c="1"  readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[2]" class="stock"  c="2" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[3]" class="stock"   c="3" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[4]" class="stock"  c="4" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[5]" class="stock"  c="5" readonly="readonly" value="0"  /></td>
                    </tr>
                </table>
                <table id="data-table" class="no-vertical-border medal-detail second-level filter">
                    <tr>
                        <th scope="col" class="type">ប្រភេទ</th>
                        <th scope="col">មាស</th>
                        <th scope="col">ប្រាក់</th>
                        <th scope="col">សំរឹទ្ធ</th>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនមេដាយសរុប៖</th>
                        <td><input type="text" name="summary[6]" class="summary"  c="6" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[7]" class="summary"  c="7" readonly="readonly" value="0"  /></td>
                        <td><input type="text" name="summary[8]" class="summary"  c="8"  readonly="readonly" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនក្នុងស្តុក៖</th>
                        <td><input type="text" name="summary[6]" class="stock"  c="6" readonly="readonly"  value="0"  /></td>
                        <td><input type="text" name="summary[7]" class="stock"  c="7" readonly="readonly"  value="0"  /></td>
                        <td><input type="text" name="summary[8]" class="stock"   c="8" readonly="readonly"  value="0"  /></td>
                    </tr>
                </table>
                <table id="data-table" class="no-vertical-border medal-detail third-level filter">
                    <tr>
                        <th scope="col" class="type">ប្រភេទ</th>
                        <th scope="col"></th>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនមេដាយសរុប៖</th>
                        <td><input type="text" name="summary" c="null" class="summary"   readonly="readonly"  value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ចំនួនក្នុងស្តុក៖</th>
                        <td><input type="text" name="summary" c="null" class="stock"   readonly="readonly"   value="0"  /></td>
                    </tr>
                </table>
                <table id="data-table" class="no-vertical-border medal-detail">
                    <tr>
                        <th scope="col">ប្រភេទ</th>
                        <th scope="col">មហាសិរីវឌ្ឍន៌</th>
                        <th scope="col">មហាសេនា</th>
                        <th scope="col">ធិបឌិន្ទុ</th>
                        <th scope="col">សេនា</th>
                        <th scope="col">អស្សរិទ្ធិ</th>
                    </tr>
                    <tr>
                        <th scope="row">ព្រះរាជាណាចក្រកម្ពុជា</th>
                        <td><input type="text" name="medal[1][1]" c="1" t="1" value="0"  /></td>
                        <td><input type="text" name="medal[1][2]"  c="2" t="1" value="0"  /></td>
                        <td><input type="text" name="medal[1][3]"  c="3" t="1" value="0"  /></td>
                        <td><input type="text" name="medal[1][4]"  c="4" t="1" value="0"  /></td>
                        <td><input type="text" name="medal[1][5]"  c="5" t="1" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">សម្តេចព្រះមហាក្សត្រីយានី</th>
                        <td><input type="text" name="medal[2][1]"  c="1" t="2" value="0"  /></td>
                        <td><input type="text" name="medal[2][2]"  c="2" t="2" value="0"  /></td>
                        <td><input type="text" name="medal[2][3]"  c="3" t="2" value="0"  /></td>
                        <td><input type="text" name="medal[2][4]"  c="4" t="2" value="0"  /></td>
                        <td><input type="text" name="medal[2][5]"  c="5" t="2" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">សុវត្ថារា</th>
                        <td><input type="text" name="medal[3][1]"  c="1" t="3" value="0"  /></td>
                        <td><input type="text" name="medal[3][2]"  c="2" t="3" value="0"  /></td>
                        <td><input type="text" name="medal[3][3]"  c="3" t="3" value="0"  /></td>
                        <td><input type="text" name="medal[3][4]"  c="4" t="3" value="0"  /></td>
                        <td><input type="text" name="medal[3][5]"  c="5" t="3" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">មុនីសារ៉ាភ័ណ្ឌ</th>
                        <td><input type="text" name="medal[4][1]"  c="1" t="4" value="0"  /></td>
                        <td><input type="text" name="medal[4][2]"  c="2" t="4" value="0"  /></td>
                        <td><input type="text" name="medal[4][3]"  c="3" t="4" value="0"  /></td>
                        <td><input type="text" name="medal[4][4]"  c="4" t="4" value="0"  /></td>
                        <td><input type="text" name="medal[4][5]"  c="5" t="4" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">សហមេត្រី</th>
                        <td><input type="text" name="medal[5][1]"  c="1" t="5" value="0"  /></td>
                        <td><input type="text" name="medal[5][2]"  c="2" t="5" value="0"  /></td>
                        <td><input type="text" name="medal[5][3]"  c="3" t="5" value="0"  /></td>
                        <td><input type="text" name="medal[5][4]"  c="4" t="5" value="0"  /></td>
                        <td><input type="text" name="medal[5][5]"  c="5" t="5" value="0"  /></td>
                    </tr>
                </table>
            </div>
            <div>
                <table id="data-table" class="no-vertical-border">
                    <tr>
                        <th scope="col">ប្រភេទ</th>
                        <th scope="col">មាស</th>
                        <th scope="col">ប្រាក់</th>
                        <th scope="col">សំរឹទ្ធ</th>
                    </tr>
                    <tr>
                        <th scope="row">ការពារជាតិ</th>
                        <td><input type="text" name="medal[6][6]"  c="6" t="6" value="0"  /></td>
                        <td><input type="text" name="medal[6][7]"  c="7" t="6" value="0"  /></td>
                        <td><input type="text" name="medal[6][8]"  c="8" t="6" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ការងារ</th>
                        <td><input type="text" name="medal[7][6]"  c="6" t="7" value="0"  /></td>
                        <td><input type="text" name="medal[7][7]"  c="7" t="7" value="0"  /></td>
                        <td><input type="text" name="medal[7][8]"  c="8" t="7" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ស្ថាបនាជាតិ</th>
                        <td><input type="text" name="medal[8][6]"  c="6" t="8" value="0"  /></td>
                        <td><input type="text" name="medal[8][7]"  c="7" t="8" value="0"  /></td>
                        <td><input type="text" name="medal[8][8]"  c="8" t="8" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ស្ត្រីវឌ្ឍនា</th>
                        <td><input type="text" name="medal[9][6]"  c="6" t="9" value="0"  /></td>
                        <td><input type="text" name="medal[9][7]"  c="7" t="9" value="0"  /></td>
                        <td><input type="text" name="medal[9][8]"  c="8" t="9" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ខេមរាកីឡារិទ្ធិ</th>
                        <td><input type="text" name="medal[10][6]"  c="6" t="10" value="0"  /></td>
                        <td><input type="text" name="medal[10][7]"  c="7" t="10" value="0"  /></td>
                        <td><input type="text" name="medal[10][8]"  c="8" t="10" value="0"  /></td>
                    </tr>
                </table>
            </div>
            <div>
                <table id="data-table" class="no-vertical-border">
                    <tr>
                        <th scope="col">ប្រភេទ</th>
                        <th scope="col">&nbsp;</th>
                    </tr>
                    <tr>
                        <th scope="row">ជាតូបការ</th>
                        <td><input type="text" name="medal[11]"  c="null" t="11" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">ឯករាជ្យជាតិ</th>
                        <td><input type="text" name="medal[12]"  c="null" t="12" value="0"  /></td>
                    </tr>
                    <tr>
                        <th scope="row">សេនាជ័យសិទ្ធ</th>
                        <td><input type="text" name="medal[13]"  c="null" t="13"  value="0"  /></td>
                    </tr>
                </table>
            </div>
            <div class="break"></div>
        </div>
    </div>
    <!--</form>-->
    <!--</div>
    <div id="related-activity" class="content-block right">
            <div class="block-header">ប្រតិបត្តិសំខាន់ៗ</div>
        <div id="block-content"></div>
    </div>-->